<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head lang="en">
    <meta charset="utf-8"/>
    <title>网上订餐</title>
    <link th:href="@{/project/css/public.css}" rel="stylesheet"/>
    <link th:href="@{/project/css/myorder.css}" rel="stylesheet"/>
</head>
<body>
<!------------------------------head------------------------------>
<div class="head ding" th:include="include::normal_headDiv2"></div>
<!------------------------------idea------------------------------>
<div class="address mt">
    <div class="wrapper clearfix">
        <a th:href="@{/index}" class="fl">首页</a>
        <span>/</span>
        <a class="on">我的订单</a>
    </div>
</div>

<!------------------------------Bott------------------------------>
<div class="Bott">
    <div class="wrapper clearfix">
        <div class="zuo fl" th:include="include::normal_left_menu"></div>
        <div class="you fl">
            <div class="my clearfix">
                <h2 class="fl">我的订单</h2>
            </div>
            <div class="dlist clearfix">
                <ul class="fl clearfix" id="wa">
                    <li th:attr="class=${status eq ''?'on':''}"><a href="javascript:listOrder()">全部</a></li>
                    <li th:attr="class=${status eq '4'?'on':''}"><a href="javascript:listOrder(4)" >待配送</a></li>
                    <li th:attr="class=${status eq '1'?'on':''}"><a href="javascript:listOrder(1)" >配送中</a></li>
                    <li th:attr="class=${status eq '2'?'on':''}"><a href="javascript:listOrder(2)" >已收货</a></li>
                    <li th:attr="class=${status eq '3'?'on':''}"><a href="javascript:listOrder(3)" >已评价</a></li>
                </ul>
                <form action="#" method="get" class="fr clearfix">
                    <input type="text" id="orderKeyWords" value="" placeholder="请输入餐饮名称、订单号"/>
                    <input type="button" onclick="listOrder()" value=""/>
                </form>
            </div>
            <div id="dataContainer"></div>
        </div>
    </div>
</div>
<div id="footer" th:include="include::normal_footerDiv"></div>
<div th:include="include::footer_normal"></div>
<script th:src="@{/project/cart.js}"></script>
<script th:inline="javascript">
    var status = [[${status}]];
    $(function () {
        $("#wa li").click(function () {
            $(this).siblings().removeClass("on");
            $(this).addClass("on");
        });
        listOrder(status);
    });
    var _$orderDataModel = $('<div class="dkuang">' +
        '                <p class="one"><span></span><a class="order_operate" style="cursor: pointer;color: blue;text-decoration: underline;margin-left: 20px;">申请退款</a></p>' +
        '                <div class="word fl clearfix">' +
        '                    <ul class="fl clearfix">' +
        '                        <li></li>' +
        '                        <li></li>' +
        '                        <li></li>' +
        '                    </ul>' +
        '                    <p class="fr">订单金额：<span></span>元</p>' +
        '                </div>' +
        '                <table><tr>' +
        '                           <th width="85%" class="items"></th>' +
        '                           <th width="15%" class="order_control">' +
        '                               <a class="order_operate">交易失败</a>' +
        '                               <a>订单详情</a>' +
        '                           </th>' +
        '                       </tr></table>' +
        '               </div>');
    var _$orderDataItemModel = $('<div class="shohou clearfix">' +
        '                    <a href="#" class="fl"><img/></a>' +
        '                    <p class="fl"><a></a><a></a></p>' +
        '                </div>');

    function listOrder(statusTemp) {
        status = $.common.isEmpty(statusTemp) ? "" : statusTemp;
        $("#dataContainer").paginationInit({
            url: ctx + "user/userOrder/list",
            pageSize: 10,
            ajaxParams: {
                "status": status,
                "params": {
                    "orderKeyWords": $("#orderKeyWords").val()
                }
            },
            loadDataItem: function (obj) {
                _$orderDataModel.find(".word li:eq(0)").html(obj.createTime);
                _$orderDataModel.find(".word li:eq(1)").html("订单号：" + obj.orderId);
                _$orderDataModel.find(".word li:eq(2)").html("地址："+convertAddr(obj)).attr("title", convertAddr(obj));
                _$orderDataModel.find(".word p span").html(obj.totalPrice);
                _$orderDataModel.find(".one span").html(convertStatus(obj.status));
                _$orderDataModel.find(".items").empty();

                for (var j = 0; j < obj.details.length; j++) {
                    _$orderDataItemModel.find("img").attr("src", obj.details[j].imgUrl);
                    _$orderDataItemModel.find("img").parent().attr("href", goodsClickHref(obj.details[j].goodsId));
                    _$orderDataItemModel.find("p.fl a:eq(0)").html(obj.details[j].goodsName)
                    _$orderDataItemModel.find("p.fl a:eq(1)").html('￥'+obj.details[j].goodsPrice+'*'+obj.details[j].goodsNum)
                    _$orderDataModel.find(".items").append(_$orderDataItemModel[0].outerHTML);
                }
                var operat = _$orderDataModel.find(".order_operate:eq(1)");
                _$orderDataModel.find(".order_operate:eq(0)").hide();
                var orderId = obj.orderId;
                if(obj.status == 1){
                    _$orderDataModel.find(".order_operate:eq(0)").show().attr("onclick","refundRemark("+orderId+")");
                }
                if (obj.status == 1 || obj.status==6) {
                    operat.attr("onclick", "receiveGoods(" + orderId + ")").html("去收货");
                } else if (obj.status == 2) {
                    operat.attr("onclick", "goRemark(" + orderId + ")").html("去评价");
                } else if (obj.status == 3 || obj.status == 5 || obj.status==7) {
                    operat.attr("onclick", "delOrder(" + orderId + ")").html("删除");
                } else if (obj.status == 4) {
                    operat.attr("onclick", "cancelOrder(" + orderId + ")").html("取消订单");
                }
                _$orderDataModel.find(".order_operate").next().attr("href",ctx+"user/userOrder/view/"+obj.orderId);
                return _$orderDataModel[0].outerHTML;
            }
        });
    }

    function receiveGoods(orderId) {
        if (confirm("确认收货吗？")) {
            $.ajax({
                url: ctx + "user/userOrder/editStatus",
                type: "post",
                data: {
                    orderId: orderId,
                    status: "2"
                },
                dataType: "json",
                success: function (data) {
                    if (data.code == web_status.SUCCESS) {
                        location.href = ctx + "user/order?status=" + status;
                    }
                }
            });
        }
    }

    function goRemark(orderId) {
        location.href = ctx + "user/remark/" + orderId;
    }

    function delOrder(orderId) {
        if (confirm("确认删除该订单吗？")) {
            location.href = ctx + "user/userOrder/remove?orderId=" + orderId;
        }
    }

    function cancelOrder(orderId) {
        if (confirm("确认取消订单吗？")) {
            $.ajax({
                url: ctx + "user/userOrder/editStatus",
                type: "post",
                data: {
                    orderId: orderId,
                    status: "5"
                },
                dataType: "json",
                success: function (data) {
                    if (data.code == web_status.SUCCESS) {
                        location.href = ctx + "user/order";
                    }
                }
            });
        }
    }

    function refundRemark(orderId) {
        $.modal.open("申请退款",ctx+"user/userOrder/refund?orderId="+orderId,400,300);
    }
</script>
</body>
</html>
